


import React,{ Component} from 'react';
import { Table,Button } from 'antd';


const columns = [{
    title: '编号',
    dataIndex: 'code',
    key: 'code',
    sorter: true,
},{
    title: '姓名',
    dataIndex: 'name',
    key: 'name',
    sorter: true
},{
    title: '年龄',
    dataIndex: 'age',
    key: 'age',
    sorter: (a,b)=> a.age - b.age,
    //sortOrder: sortedInfo.columnKey === 'age' && sortedInfo.order,

},{
    title: '地址',
    dataIndex: 'address',
    key: 'address',
    sorter: (a, b) => a.address.length - b.address.length,
},{
    title: '动作',
    dataIndex: 'action',
    key: 'action',
    sorter: true,
}]



const dataSource = [{
    key: '1',
    code: 1,
    name: '碗碗香',
    age: 22,
    address: '北京市1',
    action: '习惯优秀',
    render: text=> <a href="#">{ text }</a>,
},{
    key: '2',
    code: 2,
    name: '小小',
    age: 18,
    address: '深圳市22',
    action: '习惯优秀',
},{
    key: '3',
    code: 3,
    name: '天使里',
    age: 25,
    address: '天晶石333',
    action: '习惯优秀',
},{
    code: 4,
    key: '4',
    name: 'Disabled User',
    age: 21,
    address: '西安市4444',
    action: '习惯优秀',
}];


//下文中的Table组件中会用到这个变量，因此一定要声明,即使给一个空的对象也可以的
//const rowSelection = {}

const rowSelection = {
    onChange: ( selectedRowKeys,selectedRows ) =>{
        //console.log(`selectedRowKeys: ${ selectedRowKeys },selectedRows:${ selectedRows }`);
    },
    //record 得到一个对应的对象
    getCheckboxProps: record =>({
        //然后禁止掉
        disabled: record.name === 'Disabled User',
    })
}

class TabCheckBox2  extends Component {
    constructor(props) {
        super(props);
        this.state = {
            filteredInfo: null,
            sortedInfo: null,
        }
    }
    handleChange(pagination, filters, sorter) {
        console.log('params', pagination, filters, sorter);
        // this.setState({
        //     //filteredInfo: filters,
        //     //sortedInfo: sorter,
        // })
    }

    render() {
        return(
            <div>
                <Table
                    rowSelection={ rowSelection }
                    columns={ columns }
                    dataSource={ dataSource}
                    onChange={ this.handleChange }
                />

            </div>
        )
    }
}
export default TabCheckBox2